
<div class="navbar navbar-default" role="navigation">
    <div class="container">

        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">Welcome to yellowshop.sg</a>
        </div>

        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li><a href="<?php echo $GLOBALS['base_path'] ?>">Home</a></li>
                <li class="active"><a href="#">Products</a></li>
                <li><a href="#">GovMall</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li>
                    <?php
                    global $user;
                    global $base_url;
                    drupal_add_js(drupal_get_path('theme', 'yellowpage') . '/js/jquery-min.js');
                    drupal_add_js(drupal_get_path('theme', 'yellowpage') . '/js/home.js');
                    if ($user->uid == 0) {
                        print l(t('Join in'), 'user');
                    } else {
                        print l(t('Log out'), 'logout');
                    }
                    ?>
                </li>
                <li>
                    <?php if ($user->uid == 0) { ?>
                        <a href="<?php echo $GLOBALS['base_path'] ?>user/register">Sign in</a></div>
                    <?php } ?>
                </li>
            </ul>
        </div><!-- /.nav-collapse -->
    </div><!-- /.container -->
</div><!-- /.navbar -->

<div class="container">
    <div class="row">
        <img src="http://shop.yellowpages.com.sg/syp2010/images2011/ypshoplogo_m.jpg"/>
    </div>
    <div class="row">    
        <div class="jumbotron main-search-box">
            
                <div class="form-group col-md-4">
                    <input type="text" class="form-control" id="searchQuery" placeholder="Enter keyword">
                </div>
                <div class="form-group col-md-4">
                    <select class="form-control">
                        <option value="">All</option>
                        <option value="">CD ROM (YP)</option>
                        <option value="">D&B Reports</option>
                        <option value="">Meteorological Service Singapore (MSS)</option>
                        <option value="">Publications</option>
                        <option value="">SIP & DIP Plans</option>
                    </select>
                </div>
                <button id="submit" class="btn btn-default">Search</button>
                <a href="#" class="btn btn-link btn-xs">Advance search</a>
            
        </div>
    </div>
    <div class="row">
        <div class="col-xs-6 col-sm-3 col-md-3" id="sidebar" role="navigation">
            <?php print render($page['sidebar_first']); ?>
        </div><!--/span-->
        <div class="col-xs-12 col-sm-9 col-md-9">
            <p class="pull-right visible-xs">
                <button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">Toggle nav</button>
            </p>
            <div class="row"><h4><strong>Featured Product(s)</strong></h4></div>
            <?php if ($messages): ?>
                <div id="console" class="clearfix"><?php print $messages; ?></div>
            <?php endif; ?>
            <?php print render($page['content']); ?>
        </div>


    </div><!--/row-->

    <hr>

    <footer>
        <div class="navbar navbar-yp-footer" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                </div>
                <div class="collapse navbar-collapse">
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="#">Home</a></li>
                        <li><a href="#">Member Info</a></li>
                        <li><a href="#">Order Status</a></li>
                        <li><a href="#">Shopping Guide</a></li>
                        <li><a href="#">Shopping Policy</a></li>
                        <li><a href="#">Join Us A Merchant</a></li>
                        <li><a href="#">Feedback</a></li>
                        <li><a href="#">Disclaimer</a></li>
                        <li><a href="#">Security & Policy</a></li>
                    </ul>
                </div><!-- /.nav-collapse -->
            </div><!-- /.container -->
        </div><!-- /.navbar -->
        <p style="text-align: right">
            <img class="img-thumbnail" alt="Verified by:" src="http://shop.yellowpages.com.sg/syp2010/images2009/icons.jpg">
        </p>
        <p style="text-align: center">Copyright © 2014. Global Yellow Pages Limited. All rights reserved</p>
    </footer>

</div><!--/.container-->